文字装飾と箇条書き
今週は、ホームページ作成の初心者を対象にホームページの基本を紹介します。テーマは「文字装飾と箇条書き」です。ホームページに表示する文字は、ワープロで作成する文書のように、太字や下線、斜体などの装飾を指定できます。また、先頭に記号をつけた箇条書きなども簡単に作成できます。

→ いろいろな文字装飾
 
HTMLには文字を装飾するためのタグがいくつか用意されていますが、これらの使用方法は全て同じで、装飾する文字をタグで囲むだけです。たとえば太字の装飾を施す場合は、その文字を「B」タグと「/B」タグで挟みます。これだけの記述で文字に装飾を施すことができます。なお、文字の装飾用のタグは、以下のようなものが用意されています。
太字 B
斜体 I
下線 U
取り消し線 S
上付き文字 SUP
下付き文字 SUB
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
<FONT size="4">
文字を<B>太字</B>に装飾した場合<BR><BR>
文字を<I>斜体</I>に装飾した場合<BR><BR>
文字を<U>下線</U>に装飾した場合<BR><BR>
文字を<S>取り消し線</S>に装飾した場合<BR><BR>
文字を<SUP>上付き文字</SUP>に装飾した場合<BR><BR>
文字を<SUB>下付き文字</SUB>に装飾した場合<BR><BR>
</FONT>
</BODY>

</HTML>


→ 記号や番号を先頭に付けた箇条書き
 
ホームページの文章内に箇条書きを記述する場合は、リストを使用すると便利です。リストは「UL」タグと「OL」タグの2種類があり、「UL」タグは箇条書きの先頭に記号を、「OL」タグは箇条書きの先頭に数字を表示します。記述方法は、箇条書きにする部分全体を「UL」または「OL」タグで挟み、さらに各項目を「LI」タグで挟めばOKです。なお、この場合は「BR」タグを記述しなくても自動的に改行が実行されます。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>
先頭に記号をつけた箇条書き<BR>
<UL>
<LI>札幌</LI>
<LI>東京</LI>
<LI>名古屋</LI>
<LI>大阪</LI>
<LI>福岡</LI>
</UL>

<BR><BR>

先頭に数字をつけた箇条書き<BR>
<OL>
<LI>鈴木</LI>
<LI>佐藤</LI>
<LI>山田</LI>
<LI>田中</LI>
<LI>斉藤</LI>
</OL>
</BODY>

</HTML>


→ 先頭に付ける文字の変更
 
リストでは、type属性の指定により箇条書きの先頭に付ける文字を変更することも可能です。「UL」タグの場合は、disc（黒丸）、circle（白丸）、square（四角）といった記号を指定できます。「OL」タグの場合は、1（1,2,3,…）、a（a,b,c,…）、A（A,B,C,…）、i（i,ii,iii,…）、I（I、II、III）といった記号を指定できます。
<HTML>
<HEAD>
  <TITLE>初めてのホームページ作成</TITLE>
</HEAD>

<BODY>

ULタグでtypeにdiscを指定した場合<BR>
<UL type="disc">
<LI>札幌</LI><LI>東京</LI><LI>名古屋</LI><LI>大阪<LI><LI>福岡</LI>
</UL>

<BR><BR>

ULタグでtypeにcircleを指定した場合<BR>
<UL type="circle">
<LI>札幌</LI><LI>東京</LI><LI>名古屋</LI><LI>大阪</LI><LI>福岡</LI>
</UL>

<BR><BR>

ULタグでtypeにsquareを指定した場合<BR>
<UL type="square">
<LI>札幌</LI><LI>東京</LI><LI>名古屋</LI><LI>大阪</LI><LI>福岡</LI>
</UL>

<BR><BR>

OLタグでtypeに1を指定した場合<BR>
<OL type="1">
<LI>鈴木</LI><LI>佐藤</LI><LI>山田</LI><LI>田中</LI><LI>斉藤</LI>
</OL>

<BR><BR>

OLタグでtypeにaを指定した場合<BR>
<OL type="a">
<LI>鈴木</LI><LI>佐藤</LI><LI>山田</LI><LI>田中</LI><LI>斉藤</LI>
</OL>

<BR><BR>

OLタグでtypeにAを指定した場合<BR>
<OL type="A">
<LI>鈴木</LI><LI>佐藤</LI><LI>山田</LI><LI>田中</LI><LI>斉藤</LI>
</OL>

<BR><BR>

OLタグでtypeにiを指定した場合<BR>
<OL type="i">
<LI>鈴木</LI><LI>佐藤</LI><LI>山田</LI><LI>田中</LI><LI>斉藤</LI>
</OL>

<BR><BR>

OLタグでtypeにIを指定した場合<BR>
<OL type="I">
<LI>鈴木</LI><LI>佐藤</LI><LI>山田</LI><LI>田中</LI><LI>斉藤</LI>
</OL>


</BODY>

</HTML>


PC�p�����y�����l���g�����������}�W�������������z �����������O�~�y�������������z Yahoo �y�V NTT-X Store

�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q���� ���������[�� �C�O���s�����������I �C�O�z�e��